import {View} from '@tarojs/components';
import {AtInput} from 'taro-ui';
import Taro from '@tarojs/taro';
import './issueModal.scss';
import {unite} from "../../utils";


class IssueModal extends Taro.Component {
    static options = {
        // addGlobalClass: true
    }
    config = {
        // component: true,
        componentGenerics: {
            // IssueModal: true
        }
    }

    state = {
        number: '',
    }

    componentWillMount() {

    }

    //input内容保存
    datum = (name,val) => {
        this.setState({
            [name]: val
        })
    };

    cancel = () => {
        if(this.props.onCancel){
            this.props.onCancel();
        }
    }


    confirm = () => {
        if (this.props.inpSate && !this.state.number) return unite.showToast('请输入邀请码');
        if(this.props.onConfirm){
            this.props.onConfirm(this.state.number);
        }
    };

    render() {
        const {number} = this.state;
        const {message, messageText, cancelBtn=true, cancelText=null, confirmText=null, inpSate=false} = this.props;
        return (
            <View className="curtain flex-center">
                <View className="popup">
                    <View className="popup-title">
                        <View>{message}</View>
                        {messageText &&(
                            <View className="popup-text-center">{messageText}</View>
                        )}
                        {inpSate && (
                            <View className="inp-wrap">
                                <AtInput
                                    border={false}
                                    className="ins"
                                    name='realName'
                                    type='number'
                                    placeholder=''
                                    value={number}
                                    onChange={this.datum.bind(this, 'number')}
                                    onBlur={this.datum.bind(this, 'number')}
                                />
                            </View>
                        )}
                    </View>
                    <View className='at-row popup-btn'>
                        {cancelBtn && (
                            <View className='at-col btn-off' onClick={this.cancel}>{cancelText || '取消'}</View>
                        )}
                        <View className='at-col btn-box' onClick={this.confirm}>{confirmText || '确认'}</View>
                    </View>
                </View>
            </View>
        )
    }
}

export default IssueModal;

